<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>事件对象</title>
    <style type="text/css">

        #areaDiv {
            border: 1px solid black;
            width: 300px;
            height: 50px;
            margin-bottom: 10px;
        }

        #showMsg {
            border: 1px solid black;
            width: 300px;
            height: 20px;
        }

    </style>
    <script>
        window.onload = function () {
            //获取两个div
            var areaDiv = document.getElementById("areaDiv");
            var showMsg = document.getElementById("showMsg");

            areaDiv.onmousemove = function (event) {

                var x = event.clientX;
                var y = event.clientY;

                showMsg.innerHTML = "x = "+x + " , y = "+y;
            };
        };
    </script>
</head>
<body>
<div id="areaDiv"></div>
<div id="showMsg"></div>
</body>
</html>